import {Component, useState} from 'react'
import {connect} from 'react-redux'
import {View} from "@tarojs/components";
import { AtTabBar,AtCard  } from 'taro-ui'
export default function () {
  let tabar = {
    current:0
  }
  const message ={
    mesDatas:[
      {
        id:1,
        name:'张三',
        mes:'通知今天加班'
      },   {
        id:1,
        name:'张三',
        mes:'通知今天加班'
      },   {
        id:1,
        name:'张三',
        mes:'通知今天加班'
      },
    ]
  }
  const [mesDatas,setMesDatas] = useState(message)
  const  [ tabarData ,setTabarData ] = useState(tabar)
  const handleChooseTabBar = (current)=>{
    console.log(current)
    setTabarData({
      current
    })
  }
return <View>
  <AtTabBar
    tabList={[
      { title: '待办事项', text: 8 },
      { title: '拍照' },
      { title: '通讯录', dot: true }
    ]}
    onClick={handleChooseTabBar}
    current={tabarData.current}
  />
  {
    mesDatas.mesDatas.map((item,index)=>{
      return   <AtCard
        note='小Tips'
        extra='额外信息'
        title={item.name}
        thumb='http://www.logoquan.com/upload/list/20180421/logoquan15259400209.PNG'
      >
        { item.mes }
      </AtCard>
    })
  }

</View>
}
